<template>
  <div style="display: flex; width: 100%; flex-direction: column">
    <avue-form
      ref="warningRef"
      :option="option"
      v-model="form"
      @submit="handleSubmit"
    ></avue-form>

    <avue-crud
      ref="emailRef"
      :table-loading="tableLoading"
      v-model="form_list"
      :option="option_list"
      @row-save="rowSave"
      @row-del="rowDel"
      :data="emails"
    ></avue-crud>
  </div>
</template>

<script setup>
import { onMounted, ref } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import { getWarningConfig, updateWarningConfig } from "@/apis/admin";

const option = ref({
  labelWidth: 120,
  column: [
    {
      label: "注册预警",
      prop: "registerNotify",
      span: 6,
      type: "switch",
    },
    {
      label: "注册预警时间",
      prop: "registerNotifyTime",
      span: 6,
      type: "number",
      rules: [
        {
          required: true,
          message: "请输入注册预警时间",
          trigger: "blur",
        },
      ],
    },
    {
      label: "充值预警",
      prop: "rechargeNotify",
      span: 6,
      type: "switch",
    },
    {
      label: "充值预警时间",
      prop: "rechargeNotifyTime",
      span: 6,
      type: "number",
      rules: [
        {
          required: true,
          message: "请输入充值预警时间",
          trigger: "blur",
        },
      ],
    },
    {
      label: "提现预警",
      prop: "withdrawNotify",
      span: 6,
      type: "switch",
    },
    {
      label: "提现预警时间",
      prop: "withdrawNotifyTime",
      span: 6,
      type: "number",
      rules: [
        {
          required: true,
          message: "请输入提现预警时间",
          trigger: "blur",
        },
      ],
    },
    {
      label: "游戏预警",
      prop: "gameNotify",
      span: 6,
      type: "switch",
    },
    {
      label: "游戏预警时间",
      prop: "gameNotifyTime",
      span: 6,
      type: "number",
      rules: [
        {
          required: true,
          message: "请输入游戏预警时间",
          trigger: "blur",
        },
      ],
    },
  ],
});
const form = ref({
  emails: [],
  gameNotify: false,
  gameNotifyTime: 0,
  rechargeNotify: false,
  rechargeNotifyTime: 0,
  registerNotify: false,
  registerNotifyTime: 0,
  withdrawNotify: false,
  withdrawNotifyTime: 0,
});
const emails = ref([]);
const form_list = ref({});
const tableLoading = ref(false);
const option_list = ref({
  index: true,
  border: true,
  stripe: true,
  menuAlign: "center",
  loadingText: "加载中...",
  loadingSpinner: "svg",
  loadingSvgViewBox: "-10, -10, 50, 50",
  loadingBackground: "rgba(122, 122, 122, 0.6)",
  searchShow: false,
  columnBtn: false,
  refreshBtn: false,
  editBtn: false,
  column: [
    {
      label: "邮箱",
      prop: "emails",
      rules: [
        {
          required: true,
          message: "请输入邮箱",
          trigger: "blur",
        },
      ],
    },
  ],
});
const handleSubmit = (form, done) => {
  updateWarningConfig
    .post("", {
      ...form,
    })
    .then((res) => {
      done();
      if (res.code == 200) {
        ElMessage.success("修改已保存");
        getConfig();
      }
    });
};
onMounted(() => {
  getConfig();
});

const getConfig = () => {
  getWarningConfig.get("", {}).then((res) => {
    if (res.code == 200) {
      form.value = {
        ...res.data,
        emails: res.data.emails === null ? [] : res.data.emails,
      };
      if (res.data.emails !== null) {
        let temp = [];
        res.data.emails.map((item) => {
          temp.push({
            emails: item,
          });
        });
        emails.value = temp;
      }
    }
  });
};

const rowSave = async (row, done, loading) => {
  form.value.emails.push(row.emails);
  updateWarningConfig
    .post("", {
      ...form.value,
    })
    .then((res) => {
      done();
      if (res.code == 200) {
        ElMessage.success("修改已保存");
        getConfig();
      }
    });
};
const rowDel = (row, index, done) => {
  ElMessageBox.confirm("此操作将永久删除该配置, 是否继续?", "提示", {
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: "warning",
  }).then(() => {
    form.value.emails = form.value.emails.filter((item) => {
      return row.emails != item;
    });
    updateWarningConfig
    .post("", {
      ...form.value,
    })
    .then((res) => {
      done();
      if (res.code == 200) {
        ElMessage.success("修改已保存");
        getConfig();
      }
    });
  });
};
</script>
